@page "/net/models/{projectId}/inspect/{modelId}"
@using AyBorg.Web.Shared
@using AyBorg.Web.Shared.ImageSelection
@using AyBorg.Web.Shared.Display
@using SDK.Authorization
@attribute [Authorize(Roles = $"{Roles.Administrator}, {Roles.Engineer}, {Roles.Reviewer}")]

<PageTitle>@_projectName/@_modelName | Inspect/NET | AyBorg</PageTitle>

<div class="page-loading-bar mb-1">
    <MudProgressLinear Color="Color.Primary" Indeterminate="true" Class="my-0" hidden="@(!_isLoading)" />
</div>
<MudGrid>
    <MudItem xs="12">
        <FileDropArea Hint="Drag and drop images to inspect them." OnImageAdded="@ImageAdded">
            <ImageSelection Sources="@_imageSources" OnSelectionChanged="@ImageSelectionChanged" SelectedItem="@_selectedImageSource" />
        </FileDropArea>
    </MudItem>
    <MudItem xs="12" class="mud-full-height">
        <MudCard class="mud-full-height">
            <MudCardHeader>
                <MudText Typo="Typo.h6">Image</MudText>
            </MudCardHeader>
            <MudCardContent>
                <div class="model-inspect-display">
                    <Display2D
                        Base64Image="@(_selectedImageSource != null ? _selectedImageSource.ToBase64String() : string.Empty)"
                        ImageWidth="@(_selectedImageSource != null ? _selectedImageSource.Width : 0)"
                        ImageHeight="@(_selectedImageSource != null ? _selectedImageSource.Height : 0)"/>
                </div>
            </MudCardContent>
        </MudCard>
    </MudItem>
</MudGrid>
